<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="description" content="">
		<meta name="author" content="Mosaddek">
		<meta name="keyword" content="FlatLab, Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
		<link rel="shortcut icon" href="img/favicon.html">

		<title>Widget</title>

		<!-- Bootstrap core CSS -->		<!--external css-->		<!-- Custom styles for this template -->
		<!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
		<!--[if lt IE 9]>
      <script src="js/html5shiv.js"></script>
      <script src="js/respond.min.js"></script>
    <![endif]-->
	
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    <link rel="stylesheet" href="css/bootstrap-reset.css" />
    <link rel="stylesheet" href="assets/font-awesome/css/font-awesome.css" />
    <link rel="stylesheet" href="css/style.css" />
    <link rel="stylesheet" href="css/style-responsive.css" />
</head>

	<body>

		<section id="container" class="">
			<!--header start-->
			<header class="header white-bg">
				<div class="sidebar-toggle-box">
					<div data-original-title="Toggle Navigation" data-placement="right" class="icon-reorder tooltips"></div>
				</div>
				<!--logo start-->
				<a href="#" class="logo">Flat<span>lab</span></a>
				<!--logo end-->
				<div class="nav notify-row" id="top_menu">
					<!--  notification start -->
					<ul class="nav top-menu">
						<!-- settings start -->
						<li class="dropdown">
							<a data-toggle="dropdown" class="dropdown-toggle" href="#">
								<i class="icon-tasks"></i>
								<span class="badge bg-success">6</span>
							</a>
							<ul class="dropdown-menu extended tasks-bar">
								<div class="notify-arrow notify-arrow-green"></div>
								<li>
									<p class="green">You have 6 pending tasks</p>
								</li>
								<li>
									<a href="#">
										<div class="task-info">
											<div class="desc">Dashboard v1.3</div>
											<div class="percent">40%</div>
										</div>
										<div class="progress progress-striped">
											<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
												<span class="sr-only">40% Complete (success)</span>
											</div>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="task-info">
											<div class="desc">Database Update</div>
											<div class="percent">60%</div>
										</div>
										<div class="progress progress-striped">
											<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
												<span class="sr-only">60% Complete (warning)</span>
											</div>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="task-info">
											<div class="desc">Iphone Development</div>
											<div class="percent">87%</div>
										</div>
										<div class="progress progress-striped">
											<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 87%">
												<span class="sr-only">87% Complete</span>
											</div>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="task-info">
											<div class="desc">Mobile App</div>
											<div class="percent">33%</div>
										</div>
										<div class="progress progress-striped">
											<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 33%">
												<span class="sr-only">33% Complete (danger)</span>
											</div>
										</div>
									</a>
								</li>
								<li>
									<a href="#">
										<div class="task-info">
											<div class="desc">Dashboard v1.3</div>
											<div class="percent">45%</div>
										</div>
										<div class="progress progress-striped active">
											<div class="progress-bar" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%">
												<span class="sr-only">45% Complete</span>
											</div>
										</div>

									</a>
								</li>
								<li class="external">
									<a href="#">See All Tasks</a>
								</li>
							</ul>
						</li>
						<!-- settings end -->
						<!-- inbox dropdown start-->
						<li id="header_inbox_bar" class="dropdown">
							<a data-toggle="dropdown" class="dropdown-toggle" href="#">
								<i class="icon-envelope-alt"></i>
								<span class="badge bg-important">5</span>
							</a>
							<ul class="dropdown-menu extended inbox">
								<div class="notify-arrow notify-arrow-red"></div>
								<li>
									<p class="red">You have 5 new messages</p>
								</li>
								<li>
									<a href="#">
										<span class="photo"><img alt="avatar" src="img/avatar-mini.jpg"></span>
										<span class="subject">
                                    <span class="from">Jonathan Smith</span>
										<span class="time">Just now</span>
										</span>
										<span class="message">
                                        Hello, this is an example msg.
                                    </span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="photo"><img alt="avatar" src="img/avatar-mini2.jpg"></span>
										<span class="subject">
                                    <span class="from">Jhon Doe</span>
										<span class="time">10 mins</span>
										</span>
										<span class="message">
                                     Hi, Jhon Doe Bhai how are you ?
                                    </span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="photo"><img alt="avatar" src="img/avatar-mini3.jpg"></span>
										<span class="subject">
                                    <span class="from">Jason Stathum</span>
										<span class="time">3 hrs</span>
										</span>
										<span class="message">
                                        This is awesome dashboard.
                                    </span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="photo"><img alt="avatar" src="img/avatar-mini4.jpg"></span>
										<span class="subject">
                                    <span class="from">Jondi Rose</span>
										<span class="time">Just now</span>
										</span>
										<span class="message">
                                        Hello, this is metrolab
                                    </span>
									</a>
								</li>
								<li>
									<a href="#">See all messages</a>
								</li>
							</ul>
						</li>
						<!-- inbox dropdown end -->
						<!-- notification dropdown start-->
						<li id="header_notification_bar" class="dropdown">
							<a data-toggle="dropdown" class="dropdown-toggle" href="#">

								<i class="icon-bell-alt"></i>
								<span class="badge bg-warning">7</span>
							</a>
							<ul class="dropdown-menu extended notification">
								<div class="notify-arrow notify-arrow-yellow"></div>
								<li>
									<p class="yellow">You have 7 new notifications</p>
								</li>
								<li>
									<a href="#">
										<span class="label label-danger"><i class="icon-bolt"></i></span> Server #3 overloaded.
										<span class="small italic">34 mins</span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="label label-warning"><i class="icon-bell"></i></span> Server #10 not respoding.
										<span class="small italic">1 Hours</span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="label label-danger"><i class="icon-bolt"></i></span> Database overloaded 24%.
										<span class="small italic">4 hrs</span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="label label-success"><i class="icon-plus"></i></span> New user registered.
										<span class="small italic">Just now</span>
									</a>
								</li>
								<li>
									<a href="#">
										<span class="label label-info"><i class="icon-bullhorn"></i></span> Application error.
										<span class="small italic">10 mins</span>
									</a>
								</li>
								<li>
									<a href="#">See all notifications</a>
								</li>
							</ul>
						</li>
						<!-- notification dropdown end -->
					</ul>
				</div>
				<div class="top-nav ">
					<ul class="nav pull-right top-menu">
						<li>
							<input type="text" class="form-control search" placeholder="Search">
						</li>
						<!-- user login dropdown start-->
						<li class="dropdown">
							<a data-toggle="dropdown" class="dropdown-toggle" href="#">
								<img alt="" src="img/avatar1_small.jpg">
								<span class="username">Jhon Doue</span>
								<b class="caret"></b>
							</a>
							<ul class="dropdown-menu extended logout">
								<div class="log-arrow-up"></div>
								<li>
									<a href="#"><i class=" icon-suitcase"></i>Profile</a>
								</li>
								<li>
									<a href="#"><i class="icon-cog"></i> Settings</a>
								</li>
								<li>
									<a href="#"><i class="icon-bell-alt"></i> Notification</a>
								</li>
								<li>
									<a href="login.html"><i class="icon-key"></i> Log Out</a>
								</li>
							</ul>
						</li>
						<!-- user login dropdown end -->
					</ul>
				</div>
			</header>
			<!--header end-->
			<!--sidebar start-->
			      <aside>
          <div id="sidebar"  class="nav-collapse ">
              <!-- sidebar menu start-->
              <ul class="sidebar-menu">
                  <li class="active">
                      <a class="" href="index.html">
                          <i class="icon-dashboard"></i>
                          <span>管理首页</span>
                      </a>
                  </li>
                  <li class="sub-menu">
                      <a href="javascript:;" class="">
                          <i class="icon-book"></i>
                          <span>UI 元素</span>
                          <span class="arrow"></span>
                      </a>
                      <ul class="sub">
                          <li><a class="" href="general.html">基础</a></li>
                          <li><a class="" href="buttons.html">按钮</a></li>
                          <li><a class="" href="widget.html">小部件</a></li>
                          <li><a class="" href="slider.html">滑动条</a></li>
                          <li><a class="" href="font_awesome.html">字体icon</a></li>
                      </ul>
                  </li>
                  <li class="sub-menu">
                      <a href="javascript:;" class="">
                          <i class="icon-cogs"></i>
                          <span>组件</span>
                          <span class="arrow"></span>
                      </a>
                      <ul class="sub">
                          <li><a class="" href="grids.html">栅格化布局</a></li>
                          <li><a class="" href="calendar.html">日历</a></li>
                          <li><a class="" href="charts.html">图表</a></li>
                      </ul>
                  </li>
                  <li class="sub-menu">
                      <a href="javascript:;" class="">
                          <i class="icon-tasks"></i>
                          <span>表单</span>
                          <span class="arrow"></span>
                      </a>
                      <ul class="sub">
                          <li><a class="" href="form_component.html">表单 组件</a></li>
                          <li><a class="" href="form_wizard.html">表单 向导</a></li>
                          <li><a class="" href="form_validation.html">表单 验证</a></li>
                      </ul>
                  </li>
                  <li class="sub-menu">
                      <a href="javascript:;" class="">
                          <i class="icon-th"></i>
                          <span>数据表格</span>
                          <span class="arrow"></span>
                      </a>
                      <ul class="sub">
                          <li><a class="" href="basic_table.html">基础表格</a></li>
                          <li><a class="" href="dynamic_table.html">动态表格</a></li>
                      </ul>
                  </li>
                  <li>
                      <a class="" href="inbox.html">
                          <i class="icon-envelope"></i>
                          <span>信息 </span>
                          <span class="label label-danger pull-right mail-info">2</span>
                      </a>
                  </li>
                  <li class="sub-menu">
                      <a href="javascript:;" class="">
                          <i class="icon-glass"></i>
                          <span>其他</span>
                          <span class="arrow"></span>
                      </a>
                      <ul class="sub">
                          <li><a class="" href="blank.html">空白页</a></li>
                          <li><a class="" href="profile.html">个人资料</a></li>
                          <li><a class="" href="invoice.html">发票</a></li>
                          <li><a class="" href="404.html">404 错误</a></li>
                          <li><a class="" href="500.html">500 错误</a></li>
                      </ul>
                  </li>
                  <li>
                      <a class="" href="login.html">
                          <i class="icon-user"></i>
                          <span>登录页面</span>
                      </a>
                  </li>
              </ul>
              <!-- sidebar menu end-->
          </div>
      </aside>

			<!--sidebar end-->
			<!--main content start-->
			<section id="main-content">
				<section class="wrapper">
					<!-- page start-->
					<div class="row">
						<div class="col-lg-4">
							<!--widget start-->
							<aside class="profile-nav alt green-border">
								<section class="panel">
									<div class="user-heading alt green-bg">
										<a href="#">
											<img alt="" src="img/profile-avatar.jpg">
										</a>
										<h1>Jonathan Smith</h1>
										<p>jsmith@flatlab.com</p>
									</div>

									<ul class="nav nav-pills nav-stacked">
										<li>
											<a href="javascript:;"> <i class="icon-time"></i> Mail Inbox <span class="label label-primary pull-right r-activity">19</span></a>
										</li>
										<li>
											<a href="javascript:;"> <i class="icon-calendar"></i> Recent Activity <span class="label label-info pull-right r-activity">11</span></a>
										</li>
										<li>
											<a href="javascript:;"> <i class="icon-bell-alt"></i> Notification <span class="label label-warning pull-right r-activity">03</span></a>
										</li>
										<li>
											<a href="javascript:;"> <i class="icon-envelope-alt"></i> Message <span class="label label-success pull-right r-activity">10</span></a>
										</li>
									</ul>

								</section>
							</aside>
							<!--widget end-->
							<!--widget start-->
							<div class="panel">
								<div class="panel-body">
									<div class="bio-chart">
										<input class="knob" data-width="101" data-height="101" data-displayPrevious=true data-thickness=".2" value="63" data-fgColor="#4CC5CD" data-bgColor="#e8e8e8">
									</div>
									<div class="bio-desk">
										<h4 class="terques">ThemeForest CMS </h4>
										<p>Started : 15 July</p>
										<p>Deadline : 15 August</p>
									</div>
								</div>
							</div>
							<!--widget end-->
						</div>
						<div class="col-lg-8">
							<div class="row">
								<div class="col-lg-6">
									<!--widget start-->
									<section class="panel">
										<div class="twt-feed blue-bg">
											<h1>Jonathan Smith</h1>
											<p>jsmith@flatlab.com</p>
											<a href="#">
												<img src="img/profile-avatar.jpg" alt="">
											</a>
										</div>
										<div class="weather-category twt-category">
											<ul>
												<li class="active">
													<h5>320</h5> Tweet
												</li>
												<li>
													<h5>1245</h5> Following
												</li>
												<li>
													<h5>24657</h5> Followers
												</li>
											</ul>
										</div>
										<div class="twt-write col-sm-12">
											<textarea class="form-control  t-text-area" rows="2" placeholder="Tweet Here"></textarea>
										</div>
										<footer class="twt-footer">
											<button class="btn btn-space btn-white" data-toggle="button">
                                          <i class="icon-map-marker"></i>
                                      </button>
											<button class="btn btn-space btn-white" data-toggle="button">
                                          <i class="icon-camera"></i>
                                      </button>
											<button class="btn btn-space btn-info pull-right" type="button">
                                          <i class="icon-twitter"></i>
                                          Tweet
                                      </button>
										</footer>
									</section>
									<!--widget end-->
								</div>
								<div class="col-lg-6">
									<!--widget start-->
									<section class="panel">
										<header class="panel-heading tab-bg-dark-navy-blue">
											<ul class="nav nav-tabs nav-justified ">
												<li class="active">
													<a href="#popular" data-toggle="tab">
														Popular
													</a>
												</li>
												<li>
													<a href="#comments" data-toggle="tab">
														Comments
													</a>
												</li>
												<li class="">
													<a href="#recent" data-toggle="tab">
														Recents
													</a>
												</li>
											</ul>
										</header>
										<div class="panel-body">
											<div class="tab-content tasi-tab">
												<div class="tab-pane active" id="popular">
													<article class="media">
														<a class="pull-left thumb p-thumb">
															<img src="img/product1.jpg">
														</a>
														<div class="media-body">
															<a class=" p-head" href="#">Item One Tittle</a>
															<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
														</div>
													</article>
													<article class="media">
														<a class="pull-left thumb p-thumb">
															<img src="img/product2.png">
														</a>
														<div class="media-body">
															<a class=" p-head" href="#">Item Two Tittle</a>
															<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
														</div>
													</article>
													<article class="media">
														<a class="pull-left thumb p-thumb">
															<img src="img/product3.png">
														</a>
														<div class="media-body">
															<a class=" p-head" href="#">Item Three Tittle</a>
															<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
														</div>
													</article>
												</div>
												<div class="tab-pane" id="comments">
													<article class="media">
														<a class="pull-left thumb p-thumb">
															<img src="img/avatar-mini.jpg">
														</a>
														<div class="media-body">
															<a class="cmt-head" href="#">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a>
															<p> <i class="icon-time"></i> 1 hours ago</p>
														</div>
													</article>
													<article class="media">
														<a class="pull-left thumb p-thumb">
															<img src="img/avatar-mini2.jpg">
														</a>
														<div class="media-body">
															<a class="cmt-head" href="#">Nulla vel metus scelerisque ante sollicitudin commodo</a>
															<p> <i class="icon-time"></i> 23 mins ago</p>
														</div>
													</article>
													<article class="media">
														<a class="pull-left thumb p-thumb">
															<img src="img/avatar-mini3.jpg">
														</a>
														<div class="media-body">
															<a class="cmt-head" href="#">Donec lacinia congue felis in faucibus. </a>
															<p> <i class="icon-time"></i> 15 mins ago</p>
														</div>
													</article>
												</div>
												<div class="tab-pane " id="recent">
													Recent Item goes here
												</div>
											</div>
										</div>
									</section>
									<!--widget end-->

									<!--widget start-->
									<div class=" state-overview">
										<section class="panel">
											<div class="symbol red">
												<i class="icon-tags"></i>
											</div>
											<div class="value">
												<h1>140</h1>
												<p>Sales</p>
											</div>
										</section>
									</div>
									<!--widget end-->
								</div>
							</div>
							<div class="row">
								<div class="col-lg-12">
									<section class="panel">
										<div class="panel-body">
											<ul class="summary-list">
												<li>
													<a href="javascript:;">
														<i class=" icon-shopping-cart text-primary"></i> 1 Purchase
													</a>
												</li>
												<li>
													<a href="javascript:;">
														<i class="icon-envelope text-info"></i> 15 Emails
													</a>
												</li>
												<li>
													<a href="javascript:;">
														<i class=" icon-picture text-muted"></i> 2 Photo Upload
													</a>
												</li>
												<li>
													<a href="javascript:;">
														<i class="icon-tags text-success"></i> 19 Sales
													</a>
												</li>
												<li>
													<a href="javascript:;">
														<i class="icon-microphone text-danger"></i> 4 Audio
													</a>
												</li>
											</ul>
										</div>
									</section>
								</div>
							</div>
						</div>

					</div>
					<div class="row">
						<div class="col-lg-6">
							<section class="panel">
								<header class="panel-heading">
									时间轴
								</header>
								<div class="panel-body profile-activity">
									<h5 class="pull-right">12 August 2013</h5>
									<div class="activity terques">
										<span>
                                      <i class="icon-shopping-cart"></i>
                                  </span>
										<div class="activity-desk">
											<div class="panel">
												<div class="panel-body">
													<div class="arrow"></div>
													<i class=" icon-time"></i>
													<h4>10:45 AM</h4>
													<p>Purchased new equipments for zonal office setup and stationaries.</p>
												</div>
											</div>
										</div>
									</div>
									<div class="activity alt purple">
										<span>
                                      <i class="icon-rocket"></i>
                                  </span>
										<div class="activity-desk">
											<div class="panel">
												<div class="panel-body">
													<div class="arrow-alt"></div>
													<i class=" icon-time"></i>
													<h4>12:30 AM</h4>
													<p>Lorem ipsum dolor sit amet consiquest dio</p>
												</div>
											</div>
										</div>
									</div>
									<div class="activity blue">
										<span>
                                      <i class="icon-bullhorn"></i>
                                  </span>
										<div class="activity-desk">
											<div class="panel">
												<div class="panel-body">
													<div class="arrow"></div>
													<i class=" icon-time"></i>
													<h4>10:45 AM</h4>
													<p>Please note which location you will consider, or both. Reporting to the VP you will be responsible for managing.. </p>
												</div>
											</div>
										</div>
									</div>

									<div class="activity alt green">
										<span>
                                      <i class="icon-beer"></i>
                                  </span>
										<div class="activity-desk">
											<div class="panel">
												<div class="panel-body">
													<div class="arrow-alt"></div>
													<i class=" icon-time"></i>
													<h4>12:30 AM</h4>
													<p>Please note which location you will consider, or both.</p>
												</div>
											</div>
										</div>
									</div>

								</div>
							</section>
						</div>
						<div class="col-lg-6">
							<section class="panel">
								<header class="panel-heading">
									聊天
								</header>
								<div class="panel-body">
									<div class="timeline-messages">
										<!-- Comment -->
										<div class="msg-time-chat">
											<a href="#" class="message-img"><img class="avatar" src="img/chat-avatar.jpg" alt=""></a>
											<div class="message-body msg-in">
												<span class="arrow"></span>
												<div class="text">
													<p class="attribution">
														<a href="#">Jhon Doe</a> at 1:55pm, 13th April 2013</p>
													<p>Hello, How are you brother?</p>
												</div>
											</div>
										</div>
										<!-- /comment -->

										<!-- Comment -->
										<div class="msg-time-chat">
											<a href="#" class="message-img"><img class="avatar" src="img/chat-avatar2.jpg" alt=""></a>
											<div class="message-body msg-out">
												<span class="arrow"></span>
												<div class="text">
													<p class="attribution">
														<a href="#">Jonathan Smith</a> at 2:01pm, 13th April 2013</p>
													<p>I'm Fine, Thank you. What about you? How is going on?</p>
												</div>
											</div>
										</div>
										<!-- /comment -->

										<!-- Comment -->
										<div class="msg-time-chat">
											<a href="#" class="message-img"><img class="avatar" src="img/chat-avatar.jpg" alt=""></a>
											<div class="message-body msg-in">
												<span class="arrow"></span>
												<div class="text">
													<p class="attribution">
														<a href="#">Jhon Doe</a> at 2:03pm, 13th April 2013</p>
													<p>Yeah I'm fine too. Everything is going fine here.</p>
												</div>
											</div>
										</div>
										<!-- /comment -->

										<!-- Comment -->
										<div class="msg-time-chat">
											<a href="#" class="message-img"><img class="avatar" src="img/chat-avatar2.jpg" alt=""></a>
											<div class="message-body msg-out">
												<span class="arrow"></span>
												<div class="text">
													<p class="attribution">
														<a href="#">Jonathan Smith</a> at 2:05pm, 13th April 2013</p>
													<p>well good to know that. anyway how much time you need to done your task?</p>
												</div>
											</div>
										</div>
										<!-- /comment -->
										<!-- Comment -->
										<div class="msg-time-chat">
											<a href="#" class="message-img"><img class="avatar" src="img/chat-avatar.jpg" alt=""></a>
											<div class="message-body msg-in">
												<span class="arrow"></span>
												<div class="text">
													<p class="attribution">
														<a href="#">Jhon Doe</a> at 1:55pm, 13th April 2013</p>
													<p>Hello, How are you brother?</p>
												</div>
											</div>
										</div>
										<!-- /comment -->
									</div>
									<div class="chat-form">
										<div class="input-cont ">
											<input type="text" class="form-control col-lg-12" placeholder="Type a message here...">
										</div>
										<div class="form-group">
											<div class="pull-right chat-features">
												<a href="javascript:;">
													<i class="icon-camera"></i>
												</a>
												<a href="javascript:;">
													<i class="icon-link"></i>
												</a>
												<a class="btn btn-danger" href="javascript:;">Send</a>
											</div>
										</div>

									</div>
								</div>
							</section>
						</div>
					</div>
					<div class="row">
						<div class="col-lg-4">
							<section class="panel">
								<header class="panel-heading">
									基础条目
								</header>
								<ul class="list-group">
									<li class="list-group-item">Cras justo odio</li>
									<li class="list-group-item">Dapibus ac facilisis in</li>
									<li class="list-group-item">Morbi leo risus</li>
									<li class="list-group-item">Porta ac consectetur ac</li>
									<li class="list-group-item">Vestibulum at eros</li>
									<li class="list-group-item">Vestibulum at eros</li>
								</ul>
							</section>
						</div>
						<div class="col-lg-4">
							<section class="panel">
								<header class="panel-heading">
									链接项
								</header>
								<div class="list-group">
									<a class="list-group-item " href="#">
										Cras justo odio
									</a>
									<a class="list-group-item active" href="javascript:;">Dapibus ac facilisis in</a>
									<a class="list-group-item" href="javascript:;">Morbi leo risus</a>
									<a class="list-group-item" href="javascript:;">Porta ac consectetur ac</a>
									<a class="list-group-item" href="javascript:;">Vestibulum at eros</a>
									<a class="list-group-item" href="javascript:;">Vestibulum at eros</a>
								</div>
							</section>
						</div>
						<div class="col-lg-4">
							<section class="panel">
								<header class="panel-heading">
									自定义内容
								</header>
								<div class="list-group">
									<a class="list-group-item " href="javascript:;">
										<h4 class="list-group-item-heading">List group item heading</h4>
										<p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
									</a>
									<a class="list-group-item active" href="javascript:;">
										<h4 class="list-group-item-heading">List group item heading</h4>
										<p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
									</a>
									<a class="list-group-item" href="javascript:;">
										<h4 class="list-group-item-heading">List group item heading</h4>
										<p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
									</a>
								</div>
							</section>
						</div>
					</div>
					<!-- page end-->
				</section>
			</section>
			<!--main content end-->
		</section>

		<!-- js placed at the end of the document so the pages load faster -->
		<!--common script for all pages-->
	
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.scrollTo.min.js"></script>
<script type="text/javascript" src="js/jquery.nicescroll.js"></script>
<script src="assets/jquery-knob/js/jquery.knob.js"></script>
<script src="js/common-scripts.js"></script>
<script>
			//knob 简单图表
			$(".knob").knob();
		</script>
</body>

</html>